<template>
    <div class="invest-wrap">
        <ul v-if="tbzlistData && tbzlistData.length">
            <li v-for="(item, index) in tbzlistData" class="invest-wrap-li" :key="index">
                <nuxt-link :to="linkmatch(item.investType, item.investRecordId, item.orderId)">
                    <div class="invest-wrap-div">
                        <p class="product-title"><span>{{item.productName}}</span><span
                                v-if="item.variablePeriod" class="lable">浮动期限</span><span v-if="item.supportCzz === '1'" class="lable">支持债转</span></p>
                        <ul class="invest-wrap-div-ul clearfix">
                            <li class="invest-wrap-div-li left">
                                <p class="cont">暂无</p>
                                <p class="detail">参考回报</p>
                            </li>
                            <li class="invest-wrap-div-li middle">
                                <p class="cont">{{formatMoney(item.capital)}}</p>
                                <p class="detail">冻结金额</p>
                            </li>
                            <li class="invest-wrap-div-li right">
                                <p class="cont">{{item.investProgress + '%'}}</p>
                                <p class="detail">筹集进度</p>
                            </li>
                        </ul>
                    </div>
                </nuxt-link>
            </li>
        </ul>
        <div class="no-records" v-if="tbzlistData && tbzlistData.length === 0 && tbzquery">
            <img src="~/assets/img/no-records.png" class="detail-img" />
            <p class="detail">暂无记录</p>
        </div>
        <div class="isloding" v-if="!tbzquery && loding">
            <mt-spinner :type="3" :size="30"></mt-spinner>
        </div>
    </div>
</template>
<script>
  import formatMoney from '~/helper/formatMoney'
  import conv from '~/helper/conv'
  export default {
    name: 'tbz-list',
    props: {
      tbzlistData: {
        default: () => []
      },
      loding: {
        default: false
      },
      tbzquery: {
        default: false
      }
    },
    data () {
      return {}
    },
    methods: {
      formatMoney (money) {
        if (money) {
          return formatMoney.formatMoney(money)
        }
        return money
      },
      toDateStr (date) {
        if (date) {
          return conv.toDateStr(date)
        }
        return date
      },
      linkmatch (investType, investRecordId, orderId) {
        if (investType === '1') { // 优易计划是1  网贷是0  债转是2？？债转跳什么详情
          return '/cfmatchlist/' + orderId
        } else {
          return '/bid/' + investRecordId
        }
      }
    }
  }
</script>
<style lang='sass' src='~/assets/sass/invest-list.sass'></style>